<?php
include_once "config.php"
?>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>LittleSmurfs</title>
<link href="<?php echo ABSPATH."resource/css/style.css" ?>" rel="stylesheet" type="text/css" />
<link href="<?php echo ABSPATH."resource/css/member.css" ?>" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="<?php echo ABSPATH."resource/js/jquery_1.6.2.js" ?>"></script>
<script type="text/javascript" src="<?php echo ABSPATH."resource/js/jquery.easing.1.3.js" ?>"></script>
<script type="text/javascript" src="<?php echo ABSPATH."resource/js/jquery.validate.js" ?>"></script>
</head>

<body>
<div id="wrap">
	<div id="banner">
	</div>
	<div id="main-content">
		<div id="nav">
			<ul>
				<li title="home">Home</li>
				<li title="aboutUs">AboutUs</li>
				<li title="member">Members</li>
				<li title="contact">Contact</li>
				
			</ul>
		</div>
		<div id="content">
			<div id="home" class="block">
				<?php include_once "content/home.php" ?>
			</div>
			<div id="aboutUs" class="block">
				<?php include_once "content/about.php" ?>
			</div>
			<div id="contact" class="block">
				<?php include_once "content/contact.php" ?>
			</div>
			<div id="member" class="block">
				<?php include_once "content/member.php" ?>
			</div>
		</div>
		<div class="clear"</div>
	</div>
 </div>      
<!--
<p>By <a href="http://www.danharper.me" title="Web Design Portfolio of Dan Harper">Dan Harper</a> using jQuery UI Tabs for <a href="http://www.nettuts.com" title="NETUTS - SPOONFED WEB SKILLS">NETTUTS.com</a></p>
-->
<script>
	function changeContent(item){
			new_item = '#' + item
			$('.block').addClass('hide')
			$(new_item).removeClass('hide')
		}	
	$(document).ready(function(){
		
		$('.block').addClass('hide')
		$('#nav li').removeClass('selected')
		$('.block:first').removeClass('hide')
		$('#nav li:first').addClass('selected')
		$('#content').animate({width: '89%'}, 800, 'easeInOutExpo');
		$('li').click(function(){
			var item = $(this).attr('title')
			$('#nav li').removeClass('selected')
			$(this).addClass('selected')
			$('#content').animate({width: '0'}, 800, 'easeInOutExpo');
			setTimeout("changeContent('" + item +"')",800);
			$('#content').animate({width: '89%'}, 800, 'easeInOutExpo');
		});
	});
</script>
</body>
</html>